import { useRefModel } from "@/utils/hooks";
import styles from "./index.module.less";
export default defineComponent({
  name: "UploadButton",
  props: {
    modelValue: {
      type: String,
      default: "",
    },
    uploadText: {
      type: String,
      default: $t("base.import"),
    },
  },
  emits: ["update:modelValue"],
  setup(props, { emit, expose, slots, attrs }) {
    const fileObject = useRefModel(props, "modelValue", emit);
    return () => (
      <div class={styles.upload_button} {...attrs}>
        {slots?.icon?.() ?? null}
        <span>{props.uploadText}</span>
        <input
          class={styles.file}
          type="file"
          name="file"
          onChange={({ target: { files } }: any) =>
            (fileObject.value = files[0])
          }
        />
      </div>
    );
  },
});
